import { BreadcrumbComp } from '@/components/common/breadcrumb';
import NewMessageNotify from '@/components/common/new-message-notify';
import NewOrderNotify from '@/components/shop/new-order-notify';
import ShopSidebar from '@/components/shop/shop-sidebar';
import { SidebarProvider, SidebarTrigger } from '@/components/ui/sidebar';
import env from '@/lib/env';
import SocketProvider from '@/providers/socket-provider';
import { getNewMessagesNotify } from '@/service/query/message';
import { getNewOrderNotification } from '@/service/query/order';

export const dynamic = 'force-dynamic';

export default async function Layout({
  children,
}: { children: React.ReactNode }) {
  const { result, error } = await getNewOrderNotification();
  error && console.error(error.message);

  const { result: newMessagesNotify, error: newMessagesNotifyError } =
    await getNewMessagesNotify();
  newMessagesNotifyError && console.error(newMessagesNotifyError.message);

  return (
    <SocketProvider appUrl={env.APP_URL}>
      <NewOrderNotify offlineNotify={result ?? []} />
      <NewMessageNotify offlineMessage={newMessagesNotify} />
      <SidebarProvider>
        <ShopSidebar />
        <main className="w-full px-5 bg-muted">
          <div className="flex items-center gap-2 my-3">
            <SidebarTrigger />
            <BreadcrumbComp />
          </div>
          {children}
        </main>
      </SidebarProvider>
    </SocketProvider>
  );
}
